<template>
  <right-template :title="componentData.title" :tabName="componentData.tabName">
    <el-form class="right-moveable">
      <add-img-con :url="commonAttr.url" comAttr="commonAttr" picAttr="url" :isCrop="true" :isDelete="true" class="margin-left-right-16"></add-img-con>
      <input-normal label="图片地址" v-model="commonAttr.url" @change="onChangeAttr"></input-normal>
      <switch-normal v-model="commonAttr.isFullScreen" label="全屏" @change="onChangeAttr"></switch-normal>
      <color-normal v-model="commonAttr.cornerColor" label="句柄颜色" format="rgb" @change="onChangeAttr"></color-normal>
      <color-normal v-model="commonAttr.borderColor" label="线条颜色" format="rgb" @change="onChangeAttr"></color-normal>
    </el-form>
  </right-template>
</template>

<script>
import RightTemplate from '@/views/child/right/right-template.vue'
import InputNormal from '@/views/components/edit/InputNormal.vue'
import AddImgCon from '@/views/components/add-img-con.vue'
import SwitchNormal from '@/views/components/edit/SwitchNormal.vue'
import ColorNormal from '@/views/components/edit/ColorNormal.vue'

import { editUtils } from '@/views/js/edit-utils'

export default {
  name: "RightMoveable",
  mixins: [editUtils],
  components: {
    RightTemplate,
    InputNormal,
    AddImgCon,
    SwitchNormal,
    ColorNormal,
  },
};
</script>
